<!-- 模板 -->
<template>
  <div class="root">
    <van-search
      v-model="value"
      shape="round"
      background="#FFF"
      placeholder="搜索"
      :clearable="true"
      @search="onSearch"
    />
  </div>
</template>
<script>
import request from "../utils/request";
import { Toast } from "vant";
Toast.setDefaultOptions({ duration: 2000 });
export default {
  name: "",
  data() {
    return {
      value: "",
    };
  },
  props: [],
  components: {},
  computed: {},
  filters: {},
  methods: {
    async onSearch() {
      if (this.value.length == 0) {
        return console.log(11);
      }
      let options = {
        url: "users/search",
        type: "get",
        data: {
          goodsName: this.value,
        },
      };
      try {
        let { data: res } = await request(options);
        if (res.meta.status !== 200) {
          return Toast.fail(res.meta.msg);
        }
        Toast.success(res.meta.msg);
        sessionStorage.setItem("search-list", JSON.stringify(res));
        console.log(this.$route.path);
        if (this.$route.path !== "/searchList") {
          this.$router.push("/searchList");
        } else {
          location.reload();
        }
      } catch (error) {
        console.log(error);
      }
    },
  },
  created() {},
  mounted() {},
};
</script>
<style lang="less" scoped>
// @import url(); 引入公共css类
.van-search {
  padding: 0.32rem;
  /deep/.van-field__left-icon {
    width: 10%;
    display: flex;
    align-items: center;
    justify-content: center;
    .van-icon {
      font-size: 0.4rem;
      color: #777;
    }
  }
  /deep/.van-field__body {
    .van-icon {
      font-size: 0.4rem;
    }
  }
  /deep/.van-field__control {
    height: 0.52rem;
    font-size: 0.24rem;
  }
}
</style>
